$(function() {
	let typeChange = function (series) {
		let type = ""
		$.ajax({
			url:"http://120.27.209.174:1010/api/v1/posts_type",
			async:false,
			success(res) {
				for (let i = 0;i < res.length;i++){
					if (res[i].type === series){
						type = res[i].text
					}
				}
			}
		})
		return type
	}
	//以size为依据分割数据
	let newsCount = function(size){
		let newArr
		$.ajax({
			url:"http://120.27.209.174:1010/api/v1/posts",
			async:false,
			success(res) {
				let data = res.data
				newArr = data.$chunk(size)
			}
		})
		return newArr
	}
	//根据数据总数生成页码(size可更改)
	newsCount(4).forEach(function (item,index) {
		$(`<li class="page-item"><a class="page-link" href="#">${index+1}</a></li>`).appendTo(".pageBtn")
	})
	$(".page-box").on("click","a.page-turning",function () {
		//$(".my-table tbody").html("")
		console.log(this)

	})
	$(".pageBtn").on("click","a.page-link",function () {
		$(".my-table tbody").html("")
		$(".pageBtn .page-link").css("color","#007bff")
		$(this).css("color","red")
		let pageNum = this.innerHTML
		$.ajax({
			url: `http://120.27.209.174:1010/api/v1/posts?page=${pageNum}&size=4`,//（修改size的值等于newCount的实参）
			success(res) {
				const data = res.data
				data.forEach(function (item,index) {
					$(`<tr>
					  <th scope="row">${index+1}</th>
					  <td>${item.title}</td>
					  <td>${typeChange(item.type)}</td>
					  <td>${item.author}</td>
					  <td>
						  <img src=${item.poster} alt="">
					  </td>
					  <td>${item.view_count}</td>
					  <td>
						  <a href="./observe.html?id=${item.id}" type="button" class="btn btn-primary btn-sm">查看</a>
						  <a href="./edit.html?id=${item.id}" type="button" class="btn btn-warning btn-sm">修改</a>
						  <button data-id="${ item.id }" type="button" class="btn btn-danger btn-sm">删除</button>
					  </td>
					</tr>`
					).appendTo(".my-table tbody")
				})
			}
		})
	})
	$("a.page-link").eq(1).trigger("click")
	// 显示模态框
	$(".my-table").on("click", ".btn-danger", function() {
		const id = $(this).data("id")
		console.log(id)
		$('#modal').modal('show')
		$('#modal .btn-danger').attr("data-id", id)
		// console.log($(this).attr("data-id"))
		// console.log($(this).parent().siblings().first().html())
	})
	// 删除
	$('#modal .btn-danger').on("click", function() {
		const id = $(this).data("id")
		console.log(id)
		$.ajax({
			method: "DELETE",
			url: `http://120.27.209.174:1010/api/v1/posts/${id}`,
			success(res) {
				$('#modal').modal('hide')
				$(".my-table tbody").empty()
				$.ajax({
					url: `http://120.27.209.174:1010/api/v1/posts?page=1&size=4`,//（修改size的值等于newCount的实参）
					success(res) {
						const data = res.data
						data.forEach(function (item,index) {
							$(`<tr>
					  <th scope="row">${index+1}</th>
					  <td>${item.title}</td>
					  <td>${typeChange(item.type)}</td>
					  <td>${item.author}</td>
					  <td>
						  <img src=${item.poster} alt="">
					  </td>
					  <td>${item.view_count}</td>
					  <td>
						  <a href="./observe.html?id=${item.id}" type="button" class="btn btn-primary btn-sm">查看</a>
						  <a href="./edit.html?id=${item.id}" type="button" class="btn btn-warning btn-sm">修改</a>
						  <button data-id="${ item.id }" type="button" class="btn btn-danger btn-sm">删除</button>
					  </td>
					</tr>`
							).appendTo(".my-table tbody")
						})
					}
				})
			}
		})
	})
})


